<template>
  <div>
    <my-breadcrumb :items="['商品管理', '商品添加']"></my-breadcrumb>
    <goods-spu @setImage="setImage" ref="goodsSpu"></goods-spu>
    <goods-sku @setImage="setImage" ref="goodsSku"/>
    <goods-rich-text v-model="richText" />
    <div class="sub">
      <div style="width: 100%;margin: 0 auto;">
        <Button type="primary" long :loading="loading" @click="addGoodsSub">创建商品</Button>
      </div>
    </div>
    <image-util ref="imageUtil" @cropImg="cropImg" :fixed-number="[1, 1]"></image-util>
  </div>
</template>

<script>
import imageUtil from '../../common/imageUtil'
import goodsSku from './goodsSku'
import goodsSpu from './goodsSpu'
import goodsRichText from './goodsRichText'
export default {
  name: 'goods-add',
  data () {
    return {
      loading: false,
      richText: '',
      // sku数据，应为数组,包括图片数据和基本信息
      skuData: {}
    }
  },
  methods: {
    addGoodsSub () {
      let skuData = this.$refs.goodsSku.getSkuData()
      let spuData = this.$refs.goodsSpu.getSpuData()
      if (!skuData) {
        this.$Message.error('必须有一个sku')
        return
      }
      if (spuData !== null) {
        this.loading = true
        skuData.data.forEach((item, index) => {
          item.imageId = index
          delete item.img
        })
        let formData = new FormData()
        spuData.images.forEach((item, index) => {
          formData.append('mainImages', item, index + '.jpg')
        })
        skuData.skuImages.sort((a, b) => {
          return b.sortWeight - a.sortWeight
        })
        skuData.skuImages.forEach((item, index) => {
          formData.append('skuImages', item.img, index + '.jpg')
        })
        let detailContent = this.richText
        let unitId = spuData.unitId
        let goodsCategoryIds = spuData.goodsCategoryIds
        let provideGoodsInfo = {
          goodsMain: spuData.goodsMain,
          detailContent,
          goodsCategoryIds,
          unitId,
          goodsSkus: skuData.data,
          labelIds: spuData.labelIds
        }
        console.log(provideGoodsInfo)
        formData.append('provideGoodsInfoDto', JSON.stringify(provideGoodsInfo))
        this.$ajax.post('/goods/manage/add/goods', formData, {headers: {'Content-Type': 'multipart/form-data'}}).then((res) => {
          if (res.data.success) {
            this.$router.push({path: '/goods/manage/modify/goods/info/audit/page'})
          }
          this.loading = false
        }).catch(() => {
          this.loading = false
          this.$Message.error('添加商品出错，请稍后再试')
        })
      }
    },
    setImage (e) {
      this.$refs.imageUtil.setImage(e)
    },
    cropImg (data) {
      if (data.name === 'spu') {
        this.$refs.goodsSpu.setImgData(data.imgTime, data.blob)
      } else {
        this.$refs.goodsSku.setImgData(data.imgTime, data.blob)
      }
    },
    arrUtil (arr) {
      for (let i = 0; i < arr.length; i++) {
        if (typeof arr[i] === 'undefined' || arr[i] === '') {
          arr.splice(i, 1)
          i--
        }
      }
    }
  },
  created () {
  },
  components: {
    goodsRichText,
    goodsSku,
    goodsSpu,
    imageUtil
  }
}
</script>

<style scoped>
  li{
    list-style: none;
  }
  .sku{
    padding: 10px;
    background-color: #eee;
  }
  .sub{
    margin-top: 10px;
  }
</style>
